import QtQuick 1.1
import com.nokia.meego 1.1
import "WebRequest.js" as Web
import "qbconst.js" as Util
import "getUrls.js" as GetUrl
Page {
    id: articleContent
    tools:  tool4articl
    width:parent.width
    height: parent.height
    orientationLock: appWindow.lockposition
    property variant contentObj
    property variant user: contentObj.user
    property variant votes:contentObj.votes
    property string postId
    property int pageNumber: 1
    property int totalCount

    property bool loading: false
    signal loadStart
    signal loadStop
    onLoadStart: { loading = true; appWindow.loadStart() }
    onLoadStop: { loading = false; appWindow.loadStop() }
    Component.onDestruction: Web.xmlhttp.abort()
    onContentObjChanged: {

        postId = contentObj.id
        console.log(postId+":this is post id");
        getCommentList(true)
    }

    ToolBarLayout {
          id: tool4articl
          visible: true
          ToolIcon {
              platformIconId: "toolbar-back"

              onClicked:  appWindow.pageStack.pop();
          }
      }

    function getCommentList(isRenew){
         loading =true;
        if (isRenew)
            pageNumber = 1
        else
            pageNumber ++
        console.log("++++++++++++++++++++"+pageNumber);
        var url =
       "http://m2.qiushibaike.com/article/%1/comments?page=%2&count=50".replace("%1",postId).replace("%2",(pageNumber))
        console.log("url========="+url+"isRenew:"+isRenew)
         if (isRenew){
        Web.sendWebRequest("GET", url, loadCommentList, undefined, isRenew)
         }
         else{
             Web.loadmorecoment(url,loadCommentList);
         }
    }
    function loadCommentList(oritxt, isRenew){
        var obj = JSON.parse(oritxt)
        console.log("obj in loadCommentList" +oritxt);
        totalCount = obj.total
        if(isRenew) commentModel.clear()
        for (var i in obj.items){
            //console.log(obj.items[i]+"\n")
            commentModel.append(obj.items[i])
            //console.log(i);
        }
         loading =false;
         pageNumber = obj.page
        console.log("obj page:"+obj.page+"      isRenew:"+isRenew)

    }
    function enterPost(){
        if (!contentObj.allow_comment)
            return Web.showMessage("该文章关闭评论")
        if (appWindow.qbtoken===""){
            Web.showMessage("请先登录")
            pageStack.push(Qt.resolvedUrl("Login.qml"))
        } else
            pageStack.push(Qt.resolvedUrl("CommentPostPage.qml"),
                           { prevPage: articleContent })
    }

//    ViewHeader {
//        id: viewHeader
//        leftIcon: "pics/icon_back_enable.png"
//        text: "糗事#"+postId
//        onLeftClicked: pageStack.pop()
//    }
    ListModel { id: commentModel }




            Component {
                id: headerComp

                Item {
                    id: root

                    property bool inMyCenter: false
                    property bool inBrief
                    signal forClicked
                    signal againstClicked
                    signal commentClicked
                    signal contentClicked
                    onCommentClicked: enterPost()
                    width: parent.width
                    height: contentCol.height + 20
                   // source: "images/block_background.9.png"
                   // border { left: 10; right: 10; top: 10; bottom: 10 }

                    MouseArea {
                        anchors.fill: parent
                        onClicked: contentClicked()
                    }
                    Column {
                        id: contentCol
                        height:children.height
                        width: parent.width - 20
                        Row{
                            height: 10
                        }

                        Row {

                                id: avatarRow


                                spacing: 10
                                Rectangle
                                {
                                     width: 10
                                    height: parent.height
                                     opacity: 0.001
                                 }

                                    Image {
                                        height: children.height;
                                        width: children.width
                                        id: avatarThumb

                                        source: "images/thumb_avatar.png"
                                    }
                                    Image {
                                        height: children.height;
                                        width: children.width
                                        id: actuallAvatar

                                        fillMode: Image.PreserveAspectFit
                                        source: GetUrl.getavitorbyuser(user)
                                        onStatusChanged: if (status===Image.Ready){
                                                             avatarThumb.source = ""
                                                             avatarThumb.visible = false
                                                         }
                                    }

                                Label {
                                    width: articleContent.width
                                    color: appWindow.colorMidLight
                                    anchors.verticalCenter: parent.verticalCenter
                                    text: undefined===user?"匿名用户":user.login;
                                    elide: Text.ElideRight
                                }
                            }

                        Row {
                              id: contentComp
                              Rectangle
                              {
                                   width: 10
                                  height: parent.height
                                   opacity: 0.001
                               }


                            Text {

                                font.pointSize: appWindow.fontsize
                                color:appWindow.contntcolor
                                clip:true
                                width: parent.parent.width
                                textFormat: Text.RichText
                                text: contentObj.content.replace(/\r/g,"")
                                wrapMode: Text.Wrap
                                elide: Text.ElideRight

                               }
                        }
                        Row {
                             id: imageComp
                             width: parent.width
                             height: children.height
                             visible: undefined===contentObj.image?false:true
                             Rectangle
                             {
                                  width: 10
                                  height: parent.height
                                  opacity: 0.001
                              }


                                Image {
                                    id: briefThumb

                                    height:children.height

                                    source: "images/thumb_pic.png"
                                }
                                Image {
                                    height:children.height
                                   // fillMode: Image.PreserveAspectFit
                                    source: Util.getImageUrl("small", contentObj.image)
                                    onStatusChanged: if (status===Image.Ready){
                                                         parent.width = paintedWidth
                                                         briefThumb.source = ""
                                                         briefThumb.visible = false
                                                     }
                                }
                                MouseArea {
                                    anchors.fill: parent
                                    onClicked: appWindow.pageStack.push(Qt.resolvedUrl("ImagePage.qml"),

                                                                         {postId:postId,imageId: contentObj.image})
                                }
                            }

                        Row {
                            id: tagComp
                            Rectangle
                            {
                                 width: 10
                                height: children.height
                                 opacity: 0.001
                             }
                            Row {
                                Image {
                                    height: 24; width: 24
                                    anchors.verticalCenter: parent.verticalCenter
                                    source: "images/icon_tag.png"
                                }
                                Text {
                                    text: contentObj.tag
                                    anchors.verticalCenter: parent.verticalCenter
                                    width: contentCol.width - 24
                                    color:appWindow.labelcolor
                                    font.pointSize: 15
                                    wrapMode: Text.Wrap
                                }
                            }
                        }

                        Row {
                            id: voteComp

                            Rectangle
                            {
                                 width: 10
                                height: parent.height
                                 opacity: 0.001
                             }

                                VoteButton {
                                    type: "for"
                                    count: votes.up
                                    onClicked: root.forClicked()
                                }
                                VoteButton {

                                    type: "against"
                                    count: votes.down
                                    onClicked: root.againstClicked()
                                }
                                Rectangle
                                {
                                     width: 50
                                    height: parent.height
                                     opacity: 0.001
                                 }
                                VoteButton {

                                    type: "comment"
                                    count: contentObj.comments_count
                                    onClicked: root.commentClicked()
                                }

                            }
                        Row {

                            id: stateComp

                            Label {
                                platformStyle: LabelStyle{
                                textColor:appWindow.labelcolor
                                }
                                text: {
                                    switch(contentObj.state){
                                    case "pending": return "待审核"
                                    case "publish": return "审核已通过"
                                    case "private": return "未通过审核"
                                    default: return model.state
                                    }
                                }
                            }
                        }
                        Row{
                             height: 4

                            Image {
                                width: parent.width
                                fillMode: Image.TileHorizontally
                                source: "images/block_line.png"
                            }
                         }
                        Row{
                            id:commentloading
                            height: children.height
                            visible: loading
                            AnimatedImage {
                                width: parent.width
                                //fillMode: Image.TileHorizontally
                                source: "images/Funky-Loading-Gif-P-006.gif"
                            }
                         }
                    }
                 }

            }


                    ListView {
                        id:commentlistview
                        anchors.fill: parent
                        //anchors.topMargin:headerLoader.height+50
                        width:parent.width
                        height: children.height
                        model: commentModel
                        delegate: commentItem
                        header: headerComp
                        footer: (totalCount>pageNumber*50) ? footerComp: areaComp
                        onMovementEnded: {
                           if (commentlistview.atYEnd&&(totalCount>pageNumber*50)) {
                               getCommentList(false)
                            }
                        }

                    }








                    Component {
                        id: commentItem
                        Column {
                            id: itemColumn
                            width: 460
                            height: children.height
                            spacing: 10
                            Item {
                                width: parent.width
                                implicitHeight: childrenRect.height
                                Label {
                                    width: parent.width - floorInd.width
                                    text: user === undefined ? "匿名用户" : user.login
                                    font.pointSize: 18
                                    platformStyle: LabelStyle{
                                    textColor:appWindow.labelcolor
                                    }
                                    elide: Text.ElideRight
                                }
                                Label {
                                    id: floorInd
                                    anchors.right: parent.right
                                    text: floor
                                    font.pointSize: 18
                                    platformStyle: LabelStyle{
                                    textColor:appWindow.labelcolor
                                    }
                                }
                            }
                            Text {
                                width: parent.width
                                font.pointSize: appWindow.fontsize
                                text: content.replace(/\r/g,"")
                                wrapMode: Text.Wrap
                                color: appWindow.contntcolor
                            }
                            Image {
                                width: parent.width
                                source: "images/block_line.png"
                            }
                        }
                    }
                    Component {
                        id: footerComp

                            Label {
                                height: 30
                                anchors.verticalCenter: articleContent.verticalCenter
                                text: loading ? "载入中..." : "还有%1条评论".replace("%1",new String(totalCount-pageNumber*50))
                                platformStyle: LabelStyle{
                                textColor:appWindow.labelcolor
                                }
                                MouseArea {
                                    enabled: !loading
                                    onClicked: getCommentList(false)
                                    anchors.fill: parent
                            }
                        }


                    }
                    Component {
                        id: areaComp
                        Row{
                            Rectangle {
                                width:18
                                height: 40
                                opacity: 0.001
                             }

                        Image {
                            source: "images/input_review.png"
                            smooth: true
                            Label {
                                anchors.centerIn: parent
                                platformStyle: LabelStyle{
                                textColor:appWindow.labelcolor
                                }
                                text: contentObj.allow_comment ? "添加评论" : "该文章关闭评论"
                                color: appWindow.colorMid
                            }
                            MouseArea {
                                anchors.fill: parent
                                enabled: contentObj.allow_comment
                                onClicked: enterPost()
                            }
                        }
                    }
                    }










}


